import { StyleSheet } from "react-native";

export const createStyles = (colors: any) =>
  StyleSheet.create({
    container: {
      backgroundColor: colors.background,
      borderRadius: 8,
      marginHorizontal: 16,
      marginVertical: 8,
      padding: 16,
    },
    header: {
      flexDirection: "row",
      justifyContent: "space-between",
      alignItems: "center",
      marginBottom: 16,
    },
    title: {
      fontSize: 16,
      fontWeight: "500",
      color: colors.text.primary,
    },
    actionsContainer: {
      flexDirection: "row",
      flexWrap: "wrap",
      justifyContent: "space-between",
    },
    actionButton: {
      width: "30%",
      alignItems: "center",
      marginBottom: 16,
    },
    buttonContainer: {
      width: 50,
      height: 50,
      borderRadius: 25,
      justifyContent: "center",
      alignItems: "center",
      marginBottom: 8,
    },
    shareButton: {
      backgroundColor: "#4CAF50",
    },
    quitButton: {
      backgroundColor: "#FF5252",
    },
    deleteButton: {
      backgroundColor: "#FFC107",
    },
    buttonText: {
      fontSize: 12,
      color: colors.text.primary,
      textAlign: "center",
    },
    iconColor: {
      color: "#FFFFFF",
    },
  });
